[Grunt]自分でtaskを定義して使ってみよう

[Grunt]自分でtaskを定義して使ってみよう

Clock Icon2013.06.04

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

自分で定義したタスクを実行する

Gruntではさまざまなタスクがすでに用意されており、ビルドやデプロイ等の目的ですぐに使用できますが、
自分の実現したい機能が用意されていないことも、多々あります。
そんなときは自分でタスクを定義して使ってみましょう。

環境構築方法

今回使用した動作環境は以下のとおりです。

  • OS : MacOS X 10.7.5
  • Node.js : v0.10.8
  • npm : 1.2.23

Gruntを使える状態にしておきましょう。

% npm install -g grunt-cli
% mkdir grunt-sample
% cd grunt-sample
% npm init //すべてデフォルトでpackage.jsonを作成
% npm install grunt --save-dev

grunt.registerTaskでタスクを定義して実行する

まずはオリジナルのタスクを定義しましょう。tasksディレクトリを作成し、その中にmytask.jsファイルを作成します。

//tasks/mytask.js
module.exports = function(grunt) {
  //タスクの定義
  grunt.registerTask('mytask', 'my local task.', function() {
    var foo = grunt.config('mytask').foo;
    grunt.log.writeln('this is my local task.');
    grunt.log.writeln('foo = ' + foo);
  });
};

タスクを定義するには、grunt.registerTask関数を使用します。第1引数にタスク名、第3引数に処理内容を記述します。
今回は「mytask」という名前のタスクを定義し、オプション(foo)の内容を出力します。
※なお、registerTaskにはいろいろな使い方があるので、確認してみてください

では、mytaskを使ってみましょう。
Gruntfile.jsでgrunt.task.loadTasks関数を使用してmytaskタスクをロードします。
これでmytaskが使えるようになります。

//Gruntfile.js
var grunt = require('grunt');

module.exports = function () {

  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    mytask: {foo: 'bar'}
  });

  grunt.task.loadTasks("tasks");

};

mytaskではfoo変数にbarという値を設定しています。
では、gruntコマンドでmytaskを実行してみましょう。メッセージとfoo変数の値が表示されます。

% grunt mytask                                                                                 
Running "mytask" task
this is my local task.
foo = bar

Done, without errors.

まとめ

カスタムタスクも作り方は簡単ですね。次回はカスタムタスクを発展させた、grunt pluginの作り方について紹介します。

参考サイトなど

Share this article

facebook logohatena logotwitter logo

© Classmethod, Inc. All rights reserved.